<script type="javascript" src="/statics/js/dateFormat.js"></script>
<!-- START DEFAULT DATATABLE -->
<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title">客户回访</h3>
    </div>
    <div class="panel-heading">
        <form action="/admin/repair/manageFeedback.jspa" id="qForm">
            <div class="row">
                <div class="col-md-2">
                    <select class="form-control select" id="repairerId" name="repairerId">
                        <option value="-1">维修师傅</option>
                        <c:forEach var="par" items="${repairPersonRepository.findAll()}">
                            <option value="${par.id}"
                                    <c:if test="${param.repairerId==par.id}">selected</c:if>>${par.name}</option>
                        </c:forEach>
                    </select>
                </div>
                <div class="col-md-2">
                    <select class="form-control select" id="qField" name="qField">
                        <option value="" ${param.qField==""?"selected":""}>筛选条件</option>
                        <option value="id" ${param.qField=="id"?"selected":""}>按订单号</option>
                        <option value="connectionUserMobile" ${param.qField=="connectionUserMobile"?"selected":""}>
                            按客户手机号
                        </option>
                        <option value="connectionUserName" ${param.qField=="connectionUserName"?"selected":""}>按客户姓名
                        </option>
                        <option value="connectionUserAddress" ${param.qField=="connectionUserAddress"?"selected":""}>
                            按客户地址
                        </option>
                    </select>
                </div>
                <div class="col-md-2">
                    <div class="input-group">
                        <input class="form-control" type="text" id="qVal" name="qVal" value="${param.qVal}"
                               placeholder="筛选值"/>
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="input-group">
                        <span class="input-group-addon">从</span>
                        <input class="form-control datepicker" value="${param.dVal}" type="text" id="dVal"
                               name="dVal" onkeydown="enterPress(event)" readonly/>

                    </div>
                </div>
                <div class="col-md-2">
                    <div class="input-group">
                        <span class="input-group-addon">到</span>
                        <input class="form-control datepicker" value="${param.dVal2}" type="text" id="dVal2"
                               name="dVal2" onkeydown="enterPress(event)" readonly/>
                    </div>
                </div>
            </div>

            <div class="pull-right">
                <button type="button" class="btn btn-info" onclick="searchOrders()">搜索</button>
                <button type="button" class="btn btn-info" onclick="reloadDate()">刷新</button>
            </div>
        </form>
    </div>
    <div class="page-content-wrap">
        <div class="row">
            <div class="col-md-12">
                <div class="panel panel-default tabs">
                    <ul class="nav nav-tabs" role="tablist">
                        <li class="active"><a href="#tab-first" role="tab" data-toggle="tab" aria-expanded="true">未回访的报修单</a>
                        </li>
                        <li class=""><a href="#tab-second" role="tab" data-toggle="tab"
                                        aria-expanded="false">已回访的报修单</a></li>
                    </ul>
                    <div class="panel-body tab-content">
                        <div class="tab-pane active" id="tab-first">
                            <div class="panel-body">
                                <table class="table">
                                    <thead>
                                    <tr>
                                        <th>订单编号</th>
                                        <th>联系方式</th>
                                        <th>报修时间</th>
                                        <th>维修师傅</th>
                                        <th>完成时间</th>
                                        <th>客户回访反馈</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <c:forEach items="${unVisitOrders}" var="order">
                                        <tr class="foo" id="${order[0]}">
                                            <td>${order[0]}</td>
                                            <td>${order[1]}&nbsp;&nbsp;${order[2]}</br>${order[3]}</td>
                                            <td class="addTime" data-val="${order[4]}"></td>
                                            <td data-val="${order[5]}"><c:if test="${empty order[6]}"><span
                                                    class="btn btn-info"
                                                    onclick="selectRepairPerson(${order[0]},this)">选择</span></c:if>${order[6]}&nbsp;&nbsp;${order[7]}
                                            </td>
                                            <td class="endTime" data-val="${order[8]}"></td>
                                            <td onclick="doReply(${order[0]},'${order[9]}')">
                                                <pre id="pre${order[0]}">${order[9]}</pre>
                                            </td>
                                        </tr>
                                    </c:forEach>
                                    </tbody>
                                </table>
                                <c:out value="${pagingString}" escapeXml="false"/>
                            </div>

                        </div>

                        <div class="tab-pane" id="tab-second">
                            <div class="panel-body">
                                <table class="table">
                                    <thead>
                                    <tr>
                                        <th>订单编号</th>
                                        <th>联系方式</th>
                                        <th>报修时间</th>
                                        <th>维修师傅</th>
                                        <th>完成时间</th>
                                        <th>客户回访反馈</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <c:forEach items="${visitOrders}" var="order">
                                        <tr class="foo" id="${order[0]}">
                                            <td>${order[0]}</td>
                                            <td>${order[1]}&nbsp;&nbsp;${order[2]}</br>${order[3]}</td>
                                            <td class="addTime" data-val="${order[4]}"></td>
                                            <td data-val="${order[5]}"><c:if test="${empty order[6]}"><span
                                                    class="btn btn-info"
                                                    onclick="selectRepairPerson(${order[0]},this)">选择</span></c:if>${order[6]}&nbsp;&nbsp;${order[7]}
                                            </td>
                                            <td class="endTime" data-val="${order[8]}"></td>
                                            <td><pre id="pre${order[0]}"> ${order[9]}</pre></td>
                                        </tr>
                                    </c:forEach>
                                    </tbody>
                                </table>
                                <c:out value="${pagingString}" escapeXml="false"/>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

</div>


<!-- END DEFAULT DATATABLE -->

<!-- MESSAGE BOX-->
<div class="message-box animated fadeIn" data-sound="alert" id="mb-remove-row">
    <div class="mb-container">
        <div class="mb-middle">
            <div class="mb-title"><span class="fa fa-times"></span> <strong>删除该维修人员</strong> ?</div>
            <div class="mb-content">
                <p>你确定要删除这个维修人员吗？</p>

                <p>本次操作将无法撤销。</p>
            </div>
            <div class="mb-footer">
                <div class="pull-right">
                    <button class="btn btn-success btn-lg mb-control-yes">确定</button>
                    <button class="btn btn-default btn-lg mb-control-close">取消</button>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- END MESSAGE BOX-->
<!-- MESSAGE BOX-->
<div class="message-box message-box-success animated fadeIn" id="mb-stock" style="top: 0">
    <div class="mb-container" style="top: 0;height: 350px">
        <div class="mb-middle">
            <div class="mb-title"><span class="fa fa-cny"></span><strong>选择师傅</strong></div>
            <div class="mb-title" id="pName_s"></div>
            <div class="mb-content" style="height: 200px">
                <div class="form-group">
                    <label class="col-md-3 control-label">选择师傅</label>

                    <div class="col-md-9">
                        <select class="form-control select" id="choiceRepairPersonId">
                            <c:forEach var="par" items="${repairPersonRepository.findAll()}">
                                <option value="${par.id}"
                                        <c:if test="${repairOrder.repairPersonId==par.id}">selected</c:if>>${par.name}&nbsp;&nbsp;${par.mobile}</option>
                            </c:forEach>
                        </select>
                    </div>
                </div>

            </div>
            <div class="mb-footer">
                <div class="text-danger" id="stockMsg"></div>
                <div class="pull-right">
                    <button class="btn btn-danger btn-lg mb-control-yes" onclick="submits()">确定</button>
                    <button class="btn btn-default btn-lg mb-control-close">取消</button>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="message-box animated fadeIn" id="mb-call">
    <div class="mb-container" style="width: 50%;left: 25%;margin: auto;">
        <div class="mb-content">
            <div>
                <textarea id="reqDescPre" style="width: 100%;overflow: auto;min-height: 80px;">
                </textarea>
            </div>
        </div>
        <div class="mb-footer" style="clear: both">
            <div class="pull-right">
                <button class="btn btn-default btn-lg mb-control-close" onclick="reload=1;updateVisit(1)">完成
                </button>
                <button class="btn btn-default btn-lg mb-control-close" onclick="reload=1;updateVisit(0)">继续跟踪
                </button>
                <button class="btn btn-default btn-lg mb-control-close">取消</button>
            </div>
        </div>
    </div>
</div>
<!-- START SCRIPTS -->
<div id="ifm"></div>
<script>
    var openId, reload = 1;
    function doReply(id, ph) {
        openId = id;
        $("#reqDescPre").val(ph);
        $("#mb-call").addClass("open");
    }
    function updateVisit(visitState){
        var feedback = $("#reqDescPre").val();
        json("/admin/repair/updateFeedback.jspa", {id:openId,feedback:feedback,visitState:visitState}, function (data) {
            if (reload == 1)
                window.location.reload();
        });
    }


    var c = eval(${states});
    var d = new Dictionary(c);
    $(function () {
        $.each($('td.orderState'), function (index, item) {
            var s = $(item).attr('data-val');
            $(item).html(d.get(s));
        });
        $.each($('td.addTime'), function (index, item) {
            var s = $(item).attr('data-val');
            $(item).html(format(new Date(s), "yyyy-MM-dd HH:mm:ss"));
        });
        $.each($('td.endTime'), function (index, item) {
            var s = $(item).attr('data-val');
            if (s != "") {
                $(item).html(format(new Date(s), "yyyy-MM-dd HH:mm:ss"));
            }
        });
    });
    function goCancelOrder(o) {
        var url = '/admin/repair/cancelOrder.jspa';
        updateOrderState(url, o);
    }
    function updateOrderState(url, id) {
        json(url, {id: id}, function (data) {
            if (data.code == 0) {
                var orderState = data.orderState;
                var vhtml = "--";
                if (orderState < 2) {
                    vhtml = '<span class="btn btn-info" onclick="goEdit(' + id + ')">修改</span>';
                    if (orderState == 0) {
                        vhtml += '<span class="btn btn-info" onclick="goTakingOrder(' + id + ')">接单</span>';
                    } else {
                        vhtml += '<span class="btn btn-info" onclick="goTakingOrder(' + id + ')" disabled >接单</span>';
                    }
                    vhtml += '<span class="btn btn-info" onclick="goFinishOrder(' + id + ')">已完成</span>' +
                            '<span class="btn btn-info" onclick="goCancelOrder(' + id + ')">取消</span>'
                }
                $("#" + id + " td:last-child").html(vhtml);
            } else {
                alert(data.description);
            }
        });
    }
    function reloadDate() {
        window.location.reload();
    }
    var selectedOrderId, selectedPersonTd;
    function selectRepairPerson(o, td) {
        selectedOrderId = o;
        selectedPersonTd = $(td).parent();
        $('#mb-stock').addClass('open');
    }
    function submits() {
        if (!confirm('确定要选择当前师傅？')) {
            return false;
        }
        var param = {
            repairOrderId: selectedOrderId,
            repairPersonId: $("#choiceRepairPersonId").val()
        }
        json('/admin/repair/choiceRepairPerson.jspa', {param: JSON.stringify(param)}, function (data) {
            if (data.code == 0) {
                $('#mb-stock').removeClass('open');
                $(selectedPersonTd).attr("date-val", data.result[0].id).html(data.result[0].name + "&nbsp;&nbsp;" + data.result[0].mobile);
            } else {
                $('#stockMsg').text(data.result);
            }
        })
    }
    var orders = [];
    function selectItem(o) {
        if ($('#' + o).hasClass("success")) {
            $('#' + o).removeClass("success");
        } else {
            $('#' + o).addClass("success");
        }
    }

    function searchOrders() {
        $('#qForm').submit();
    }
    var isDo = 0;
</script>







